import QtQuick 2.0
import QtQuick.Window 2.0
import QtQuick.Layouts 1.0
import "../CustomComponent"
import SvgImage 1.0

Rectangle {
    id: cusWindow_l_Root
    color: "transparent"
    signal close()
    property int titleHeight: 24

    Rectangle {
        id: titleBar
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        implicitHeight: titleHeight
        color: Theme.second_window_title_color
        height: titleHeight

        Rectangle {
            id: iconRect
            implicitHeight: 14
            implicitWidth: 14
            color: "transparent"
            anchors.left: parent.left
            anchors.verticalCenter: parent.verticalCenter
            anchors.leftMargin: 5

            SvgImage {
                id: iconImage
                anchors.fill: parent
                source: "qrc:/image/preview_logo.svg"
            }
        }

        CusText {
            id: appTitle
            text: TransText.preview_Image
            color: "white"
            font.pixelSize: Theme.font_size_13

            anchors.verticalCenter: parent.verticalCenter
            anchors.left: iconRect.right
            anchors.leftMargin: 5
        }

        Rectangle {
            id: closeBtn
            implicitWidth: 38
            implicitHeight: titleHeight
            color: "transparent"
            anchors.right: parent.right

            SvgImage {
                id: btnImage
                anchors.fill: parent
                source: "qrc:/image/preview_close.svg"
            }

            MouseArea {
                anchors.fill: parent
                hoverEnabled: true
                onClicked: { close(); focus = true }
                onPressed: closeBtn.color = "#FF4141"
                onEntered: closeBtn.color = "#e52e2e"
                onExited: closeBtn.color = "transparent"
            }
        }
    }

    Rectangle {
        id: contentBg
        anchors.top: titleBar.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        radius: parent.radius

        Rectangle {
            anchors.top: parent.top
            anchors.left: parent.left
            anchors.right: parent.right
            implicitHeight: parent.height / 2
        }

        MouseArea { anchors.fill: parent; onClicked: { focus = true } }
    }

}
